<template>
  <Loading v-if="!filteredNews.length && !isBookmarkList" />

  <van-card
    v-if="filteredNews.length > 0"
    v-for="currentNew in filteredNews"
    currency=""
    :price="currentNew.source"
    :desc="currentNew.digest"
    :title="currentNew.title"
    :thumb="currentNew.imgList[0]"
  >
    <template #footer>
      <van-button
        type="primary"
        size="small"
        @click="
          isBookmarkNew(currentNew)
            ? removeBookmark(currentNew)
            : addBookmark(currentNew)
        "
      >
        {{ isBookmarkNew(currentNew) ? "取消收藏" : "收藏" }}
      </van-button>
      <van-button size="small" @click="addHideNews(currentNew)"
        >隐藏</van-button
      >
    </template>
  </van-card>

  <h1 style="text-align: center" v-if="!filteredNews.length && isBookmarkList">
    暂时没有收藏任何内容
  </h1>
</template>
<script setup>
import Loading from "@/ui/Loading.vue";
import { computed } from "vue";

const props = defineProps({
  news: Array,
  bookmarkNews: Array,
  addBookmark: Function,
  removeBookmark: Function,
  isBookmarkList: { type: Boolean, default: false, required: false },
  hiddenNews: Array,
  addHideNews: Function,
});

// 文本
function isBookmarkNew(news) {
  return props.bookmarkNews.some((item) => item.title === news.title);
}

// 隐藏
function isHiddenNew(currentNew) {
  return props.hiddenNews.some((item) => item.title === currentNew.title); //判断当前新闻是否被隐藏
  //隐藏给true,不存在给false
}

const filteredNews = computed(() => {
  return props.news.filter((currentNew) => isHiddenNew(currentNew) === false);
});
</script>
